/* 作者： 开发日期： 页面描述：工作通知 修改人员：**** 修改日期：**** */
<template>
  <!-- 消息更多 -->
  <div class="page_padding">
    <MyNavBar @goback="goback" :title="title" />
    <div class="notice_con">
      <van-list
        v-model="loading"
        :finished="finished"
        finished-text="没有更多了"
        @load="getWorkList"
        v-if="workList.length > 0">
        <div class="notice_li" v-for="item in workList" :key="item.id" @click="goDetail(item)">
          <div class="notice_li_tit" :class="item.isTop == 1 ? 'notice_li_red' : ''">
            {{ item.bulletinTitle }}
          </div>
          <div class="notice_li_label">
            <span class="label_type" v-if="type === '0'">工作通知</span>
            <span class="label_type" v-if="type === '3'">工作简报</span>
            <span class="label_type" v-if="type === '4'">制度文件</span>
            <span class="label_line">|</span>
            <span class="label_time">{{ item.releaseTime }}</span>
          </div>
        </div>
      </van-list>
      <van-empty v-else description="暂无数据" />
    </div>
  </div>
</template>

<script>
import MyNavBar from '@com/MyNavBar'
import { listWorks, workSaveRead } from '@api/api.js'
export default {
  name: 'documentList',
  components: { MyNavBar },
  props: {
    showType: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
      title: '工作通知',
      workList: [],
      currentPage: '1',
      pageSize: 10,
      workTotalPages: 0,
      loading: false,
      finished: false,
      type: '0',
    }
  },
  computed: {},
  watch: {},
  created() {
    this.type = this.$route.query.type || this.showType
    if (this.type === '0') {
      this.title = '工作通知'
    } else if (this.type === '3') {
      this.title = '工作简报'
    } else if (this.type === '4') {
      this.title = '制度文件'
    }
  },
  mounted() {
    this.getWorkList()
  },
  methods: {
    goback() {
      this.$router.go(-1)
    },
    goHome() {
      this.$router.push('home')
    },
    //获取工作通知
    getWorkList() {
      listWorks({
        pageNum: this.currentPage,
        pageSize: this.pageSize,
        status: '1',
        type: this.type,
        userType: '2',
      })
        .then(res => {
          const data = res.data
          this.workList.push(...data.content)
          this.workTotalPages = data.totalSize
          this.currentPage++
          this.loading = false
          if (this.workList.length === this.workTotalPages) {
            this.finished = true
          }
        })
        .catch(err => {
          this.finished = true
        })
    },
    goDetail(item) {
      workSaveRead({
        bulletionId: item.bulletionId,
        isTop: item.isTop,
      }).then(res => {
        this.$router.push({ path: `/documentDetail`, query: { bulletionId: item.bulletionId } })
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.notice_con {
  padding: 8px 16px;
  .notice_li {
    display: flex;
    flex-direction: column;
    padding: 8px 5px;
    border: 1px solid #efefef;
    border-radius: 3px;
    margin-bottom: 8px;
    &:not(:last-of-type) {
      border-bottom: 2px solid #efefef;
    }
    .notice_li_tit {
      font-size: 13px;
      color: #333333;
      margin-bottom: 8px;
    }
    .notice_li_label {
      font-size: 12px;
      .label_type {
        color: #a57d60;
      }
      .label_line {
        color: #999999;
        margin: 0 8px;
      }
      .label_time {
        font-size: 12px;
        color: #999999;
      }
    }
    .notice_li_red:before {
      content: '顶';
      background-color: red;
      color: #fff;
      font-size: 12px;
      padding: 0 5px;
    }
  }
}
</style>
